<template>
  <div class="app-desc">
    <div class="app-desc__title">{{ title }}</div>
    <div class="app-desc__value">
      <app-grid :gap="gap" :column="column">
        <slot></slot>
      </app-grid>
    </div>
  </div>
</template>
<script setup>
const props = defineProps({
  title: String,
  gap: Number,
  column: Number,
})
</script>
<style lang="scss" scoped>
.app-desc {
  margin-bottom: 32px;
  overflow: hidden;
  &:last-child {
    margin-bottom: 0;
  }
}

.app-desc__title {
  margin-bottom: 16px;
  font-size: 16px;
  font-weight: 600;
  color: #252a30;
  background: url('@/assets/desc/icon.png') no-repeat 0 center;
  background-size: 10px 16px;
  padding-left: 16px;
}
</style>
